// 企业详情页
<template>
  <div class="detailPage">
    <div class="main">
      <el-card class="companyLogo">
        <el-row>
          <el-col :span="18">
            <div class="companyLogo-dl">
              <div class="companyLogo-logo">
                <img :src="(companyInfo.logo || require('../../../assets/img/qiye.png'))" alt />
              </div>
              <div class="companyLogn-basic">
                <div class="companyInfoNameRegister">
                  <span class="companyInfoName">{{companyInfo.name || '暂无'}}</span>
                  <span class="companyRegister">
                    <span>工商登记<span class="business" v-if="corporationBynameObj.businessCertification">已认证</span> <span
                        v-else>未认证</span>
                    </span>
                    <img v-if="corporationBynameObj.businessCertification"
                      src="../../../assets/img/afterCertification_g.png" alt="工商登记" title="工商登记">
                    <img v-else src="../../../assets/img/notCertified_g.png" alt="工商登记" title="工商登记">
                  </span>
                  <span class="companyRegister">
                    <span>税务登记<span class="business" v-if="corporationBynameObj.taxCertification">已认证</span> <span
                        v-else>未认证</span></span>
                    <img v-if="corporationBynameObj.taxCertification" src="../../../assets/img/afterCertification_s.png"
                      alt="税务登记" title="税务登记">
                    <img v-else src="../../../assets/img/notCertified_s.png" alt="税务登记" title="税务登记">
                  </span>
                </div>
                <p class="basicDescription">
                  <span>{{companyInfo.natureText || '暂无'}}&nbsp;&nbsp;</span>|
                  <span>{{companyInfo.scaleText || '暂无'}}&nbsp;&nbsp;</span>|
                  <span>{{companyInfo.tradeText || '暂无'}}</span>
                </p>
                <div class="tagContainer" v-if="companyInfo.allureText">
                  <el-tag v-for="(item, index) in companyInfo.allureText" type="info" effect="plain" :key="index">
                    {{item}}
                  </el-tag>
                </div>
              </div>
            </div>
          </el-col>
          <el-col :span="6" class="companyLogo-count">
            <div class="companyLogo-count-item">
              <p class="number wathet" v-if="companyInfo.onLineJobCount > 9999">9999 +</p>
              <p class="number wathet" v-else>{{companyInfo.onLineJobCount || 0}}</p>
              <p class="words recruit">在招职位</p>
            </div>
            <div class="companyLogo-count-item">
              <p class="number orange" v-if="companyInfo.auditionCount > 9999">9999 +</p>
              <p class="number orange" v-else>{{companyInfo.auditionCount || 0}}</p>
              <p class="words coInvite">共邀面试</p>
            </div>
          </el-col>
        </el-row>
      </el-card>
      <el-row class="companyList" :gutter="20">
        <el-col :span="18" class="companyList-col">
          <el-card v-if="companyInfo.showContact || companyInfo.showPhone || companyInfo.showMail">
            <!-- <div slot="header" class="clearfix">
              <span class="title">企业联系人</span>
            </div> -->
            <div class="companyInfo" style="padding-top:20px;">
              <div class="subTitle">
                <span>企业联系人</span>
              </div>
              <div class="content businessContacts">
                <span v-if="companyInfo.showContact">
                  <label for="">联系人姓名：</label>{{companyInfo.contact || '暂无企业联系人'}}
                </span>
                <span v-if="companyInfo.showPhone">
                  <label for="">联系人电话：</label>{{companyInfo.contactPhone || '暂无'}}
                </span>
                <span v-if="companyInfo.showMail">
                  <label for="">联系人邮箱：</label>{{companyInfo.contactMail || '暂无'}}
                </span>
              </div>
            </div>
          </el-card>
          <el-card>
            <div slot="header" class="clearfix">
              <span class="title">公司信息</span>
            </div>
            <div class="companyCont">
              <div class="companyInfo">
                <div class="subTitle">
                  <span>公司介绍</span>
                </div>
                <div class="ql-bubble">
                  <div class="infoDetailsData ql-editor" v-html="companyInfo.profile">
                  </div>
                </div>
                <!-- feat:公司风采 -->
                <div class="subTitle mt35 mb18">
                  <span>公司风采</span>
                </div>
                <!-- feat:公司风采组件 -->
                <!-- {{companyInfo.companyFileOutVo.filePath}} -->
                <companyStyle :objInfo="companyInfo"></companyStyle>
              </div>
              <!-- 招聘职位 -->
              <recruit-position></recruit-position>
            </div>
          </el-card>
        </el-col>
        <el-col :span="6" class="companyAddress-col">
          <el-card>
            <div class="companyAddress">
              <div class="subTitle">
                <span>公司地址</span>
              </div>
              <div style="width:242px;height:168px;background:#F2F2F2;margin-top:20px">
                <maps :latLng="latLng" :address='companyInfo.address' v-if='showMap'></maps>
              </div>
              <div class="address">{{companyInfo.address}}</div>
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import { getById, businessCertificationByname, taxCertificationByname } from '../../../api/index.js';
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
export default {
  name: 'Popularenterprises',
  data () {
    return {
      showMap: false,
      url: '',
      total: 0,
      latLng: {},
      // 是都全部申请
      isAll: false,
      // 公司信息
      companyInfo: {},
      // 参数
      companyId: '', // 公司id

      corporationBynameObj: {
        // 工商登记已认证:
        businessCertification: false,
        // 税务登记已认证
        taxCertification: false,
        // 企业异常
        qyycmlxx: 0,
        // 严重违法失信
        yzwfsxqymd: 0
      }
    };
  },
  components: {
  },
  created () {
    this.companyId = this.$route.query.companyId;
    this.getSelectById(this.companyId);
  },
  mounted () { },
  methods: {
    // 通过企业id获取企业详情页
    getSelectById (companyId) {
      getById(companyId).then(res => {
        if (res.success) {
          if (res.data.allureText) {
            res.data.allureText = res.data.allureText.split(',');
          }
          this.companyInfo = res.data;
          this.latLng = {
            lat: this.companyInfo.lat, // 维度
            lng: this.companyInfo.lng // 经度
          };
          this.companyInfo.profile = decodeURI(res.data.profile);
          this.showMap = true;
          // 工商
          this.businessCertificationByname(this.companyInfo.name)
          // 税务
          this.taxCertificationByname(this.companyInfo.name)
        } else {
          this.$message.error(`${res.msg}`);
        }
      });
    },
    // feat：2020/06/29
    // qixiaofei
    // 工商登记已认证 
    // 税务登记已认证: 查询
    // corporationByname (name) {
    //   let companyFrom = new FormData();
    //   companyFrom.append('companyName', name)
    //   corporationByname(companyFrom).then(res => {
    //     if (res.success) {
    //       this.corporationBynameObj = res.data
    //     }
    //   })
    // }
    // 工商登记未认
    businessCertificationByname (name) {
      let companyFrom = new FormData();
      companyFrom.append('companyName', name)
      businessCertificationByname(companyFrom).then(res => {
        if (res.success) {
          this.corporationBynameObj.businessCertification = res.data.businessCertification
        }
      })
    },
    // 税务登记已认证
    taxCertificationByname (name) {
      let companyFrom = new FormData();
      companyFrom.append('companyName', name)
      taxCertificationByname(companyFrom).then(res => {
        if (res.success) {
          this.corporationBynameObj.taxCertification = res.data.taxCertification
        }
      })
    }
  }
};
</script>
<style lang="css" scoped>
.mb18 {
    margin-bottom: 18px;
}
.mt35 {
    margin-top: 35px;
}
.detailPage {
    margin-top: 30px;
    width: 100%;
}
.detailPage .main {
    background: rgba(246, 246, 248, 1);
    width: 1200px;
    margin: 0 auto 107px;
}
.companyLogo {
    height: 144px;
}
.companyLogo /deep/.el-card__body {
    padding: 20px 44px;
}
.companyLogo-dl {
    display: flex;
}
.companyLogo-logo {
    width: 102px;
    height: 102px;
    border-radius: 6px;
    text-align: center;
    box-sizing: border-box;
    background: rgba(242, 242, 242, 1);
    opacity: 1;
}
.companyLogo-logo img {
    width: 100%;
    height: 100%;
}
.companyInfoNameRegister {
    display: flex;
    /* flex-direction: row; */
    justify-content: flex-start;
    align-items: center;
}
.companyInfoName {
    display: inline-block;
    font-size: 22px;
    font-weight: 600;
}
.companyRegister {
    display: flex;
    align-items: center;
    font-size: 14px;
    margin-left: 20px;
}
.companyRegister img {
    margin-left: 5px;
    cursor: pointer;
}
.business {
    color: #38b169;
}
.companyLogn-basic {
    padding: 5px 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.companyLogn-basic h3 {
    /* width: 120px; */
    height: 28px;
    font-size: 20px;
    font-family: PingFang SC;
    font-weight: 600;
    line-height: 16px;
    color: rgba(51, 51, 51, 1);
    opacity: 1;
}
.basicDescription {
    margin-top: 3px;
}
.companyLogn-basic p span {
    width: 28px;
    height: 20px;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 16px;
    color: rgba(85, 85, 85, 1);
    opacity: 1;
}
.companyLogn-basic .tagContainer .el-tag:not(:first-child) {
    margin-left: 10px;
    margin-top: 5px;
}
.companyLogo-count {
    height: 102px;
    display: flex;
}
.companyLogo-count-item {
    flex: 1;
    text-align: right;
}
.companyLogo-count-item .number {
    height: 50px;
    font-size: 36px;
    font-family: PingFang SC;
    font-weight: 500;
    line-height: 53px;
    opacity: 1;
}
.companyLogo-count-item .wathet {
    color: #00d3c3;
}
.companyLogo-count-item .orange {
    color: #fca418;
}
.companyLogo-count-item .words {
    height: 20px;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 16px;
    color: rgba(34, 34, 34, 1);
    opacity: 1;
    padding-top: 8px;
}
.companyList {
    margin-top: 12px;
}
.companyList /deep/.el-card__header {
    border-bottom: 0;
    padding: 23px 44px;
}
.companyList .title {
    width: 64px;
    height: 22px;
    font-size: 16px;
    font-family: PingFang SC;
    font-weight: 600;
    line-height: 16px;
    color: rgba(34, 34, 34, 1);
    opacity: 1;
}
.companyList-col /deep/.el-card__body {
    padding: 0 44px;
}
.companyCont {
    /* border: 1px solid red; */
}
/* 公司基本信息 */
.companyInfo {
    /* border: 1px solid red; */
}
/* 推荐职位 */
.recruitPosition {
    /* border:1px solid blue; */
}
.companyInfo .subTitle,
.companyAddress .subTitle {
    width: 100%;
    box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    height: 25px;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 600;
    line-height: 16px;
    color: rgba(34, 34, 34, 1);
    opacity: 1;
}
.companyInfo .subTitle span:first-child:after,
.companyAddress .subTitle span:first-child::after {
    width: 28px;
    height: 2px;
    background: #1893fc;
    content: '';
    display: block;
    margin-top: 3px;
    margin-bottom: 20px;
}
.companyInfo .content {
    margin-top: 18px;
    min-height: 360px;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 26px;
    color: rgba(34, 34, 34, 1);
    opacity: 1;
    text-indent: 2em;
    overflow-y: auto;
}
/* 企业联系人 */
.companyInfo .businessContacts {
    min-height: auto;
    text-indent: 0;
}
.businessContacts span:not(:first-child) {
    margin-left: 50px;
}
/* 右边的公司地址 */
.companyAddress-col {
    height: 322px;
    box-sizing: border-box;
}

.companyAddress-col /deep/ .el-card__body {
    padding: 23px 20.5px;
}
.address {
    width: 242px;
    height: 33px;
    font-size: 12px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 24px;
    color: rgba(85, 85, 85, 1);
    opacity: 1;
    margin-top: 15px;
}

/* 弹框样式 */
.checkouts /deep/ .el-checkbox {
    margin-top: 10px;
}
.elDialog-content {
    height: 100px;
    padding-top: 10px;
    box-sizing: border-box;
}
.dialog-footer {
    text-align: center;
}
/* pre演示自动换行（解决一行显示很长） */
.companyInfo .infoDetailsData /deep/pre {
    /* display: block;
    font-family: inherit;
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
    padding: 0;
    margin: 0;
    font-size: 13px;
    line-height: inherit;
    color: inherit;
    word-break: break-all;
    background-color: transparent;
    border: none;
    border-radius: 0; */
}
.ql-editor /deep/ol,
.ql-editor /deep/ul {
    padding-left: 0 !important;
}
</style>
